<template>
  <div>
    <!-- <el-form :model="query" label-position="left" ref="queryForm" :inline="true" label-width="70px" class="top-search">
      <el-form-item label="电话" prop="phone" label-width="40px">
        <el-input v-model="query.phone" placeholder="请输入电话" clearable @keyup.enter.native="getList(1)" />
      </el-form-item>
      <el-form-item label="客户备注名" prop="customerName" label-width="90px">
        <el-input
          v-model="query.customerName"
          placeholder="请输入客户备注名"
          clearable
          @keyup.enter.native="getList(1)" />
      </el-form-item>
      <el-form-item label-width="0">
        <el-button type="primary" @click="getList(1)">查询</el-button>
        <el-button @click="resetQuery">重置</el-button>
      </el-form-item>
    </el-form> -->

    <div class="g-card">
      <el-table ref="myTable" v-loading="loading" :data="list">
        <el-table-column type="selection" width="55" align="center" />
        <el-table-column label="申请人用户ID" align="center" prop="applicantUserId" show-overflow-tooltip />
        <el-table-column label="审批申请提交时间" align="center" prop="applyTime" show-overflow-tooltip />
        <el-table-column label="企业ID" align="center" prop="corpId" />
        <el-table-column label="审批模板id" align="center" prop="templateId"></el-table-column>
        <el-table-column label="审批模板名称" align="center" prop="spName"></el-table-column>
        <el-table-column label="审批编号" align="center" prop="spNo"></el-table-column>
        <el-table-column label="申请单状态" align="center" prop="spStatus">
          <template slot-scope="{ row }">
            <el-tag v-if="row.spStatus == 1">审批中</el-tag>
            <el-tag v-if="row.spStatus == 2" type="success">已通过</el-tag>
            <el-tag v-if="row.spStatus == 3" type="danger">已驳回</el-tag>
            <el-tag v-if="row.spStatus == 4" type="info">已撤销</el-tag>
            <el-tag v-if="row.spStatus == 6" type="info">通过后撤销</el-tag>
            <el-tag v-if="row.spStatus == 7" type="danger">已删除</el-tag>
            <el-tag v-if="row.spStatus == 10" type="success">已支付</el-tag>
          </template>
        </el-table-column>
        <el-table-column label="审批申请状态" align="center" prop="statuChangeEvent">
          <template slot-scope="{ row }">
            <el-tag v-if="row.statuChangeEvent == 1">提单</el-tag>
            <el-tag v-if="row.statuChangeEvent == 2" type="success">同意</el-tag>
            <el-tag v-if="row.statuChangeEvent == 3" type="danger">驳回</el-tag>
            <el-tag v-if="row.statuChangeEvent == 4" type="info">转审</el-tag>
            <el-tag v-if="row.statuChangeEvent == 5" type="danger">催办</el-tag>
            <el-tag v-if="row.statuChangeEvent == 6" type="info">撤销</el-tag>
            <el-tag v-if="row.statuChangeEvent == 8" type="info">通过后撤销</el-tag>
            <el-tag v-if="row.statuChangeEvent == 10" type="warning">添加备注</el-tag>
          </template>
        </el-table-column>
        <!-- <el-table-column label="操作" align="center" class-name="small-padding fixed-width">
          <template slot-scope="{ row }">
            <el-button type="text">操作</el-button>
          </template>
        </el-table-column> -->
      </el-table>
      <div>
        <pagination
          v-show="total > 0"
          :total="total"
          :page.sync="query.pageNum"
          :limit.sync="query.pageSize"
          @pagination="getList()" />
      </div>
    </div>
  </div>
</template>

<script>
import { getList } from '@/api/drainageCode/examine'

export default {
  name: 'Examine',
  data() {
    return {
      // 查询参数
      query: {
        pageNum: 1,
        pageSize: 10,
        // customerName: undefined,
        // phone: undefined,
        // addUserName: undefined,
        // addState: undefined,
        // name: undefined
      },
      // 总条数
      total: 0,
      // 表格数据
      list: [],
    }
  },
  created() {
    this.getList()
    // this.$store.dispatch(
    //   'app/setBusininessDesc',
    //   `
		// 	     <div>管理员在后台将客户导入后，系统根据分配规则自动分配给员工，员工可以一键复制客户手机号，快速添加客户，并支持添加效果统计。</div>
		// 	   `,
    // )
  },
  mounted() {},
  methods: {
    getList(page) {
      page && (this.query.pageNum = page)
      this.loading = true
      getList(this.query)
        .then(({ rows, total }) => {
          this.list = rows
          this.total = +total
          this.loading = false
        })
        .catch(() => {
          this.loading = false
        })
    },
    /** 重置按钮操作 */
    resetQuery() {
      this.dateRange = []
      this.$refs['queryForm'].resetFields()
      this.getList(1)
    },
  },
}
</script>

<style lang="scss" scoped>

</style>
